/**
 * Created by steve on 14-9-19.
 */
define(['jquery', 'jquerymobile', 'net', 'dialogs'], function($, m, net, dia) {
    // Nick added for multiple images start
    var m_news = null;
    // Nick added for multiple images end
    // 获得新闻
    function getNews(news) {
		//Fixed show duplicate news issue
		if($('#newsroom_detailed_listview li').length > 0){
			return;
		}
        var value = news;
        // 获取新闻

        function getMonthString(month) {
            if (month == 1)
                return 'Jan';
            else if (month == 2)
                return 'Feb';
            else if (month == 3)
                return 'Mar';
            else if (month == 4)
                return 'Apr';
            else if (month == 5)
                return 'May';
            else if (month == 6)
                return 'June';
            else if (month == 7)
                return 'July';
            else if (month == 8)
                return 'Aug';
            else if (month == 9)
                return 'Sept';
            else if (month == 10)
                return 'Oct';
            else if (month == 11)
                return 'Nov';
            else if (month == 12)
                return 'Dec';
            else {
                console.assert(false, '月份 %o 不存在 ', month );
            }
        }

        var date = new Date(value.addTime * 1000);
        var month = getMonthString(date.getMonth()+1);
        var time = 'Posted on ' + date.getDate() + " " + month + " " + date.getFullYear();
        var li = createNews(value.pic, value.title, value.content, time, value.TTagses, value.video);
        $('#newsroom_detailed_listview').append(li);
//        $('#newsroom_detailed_listview').listview( "refresh" );
    }

    // 创建新闻
    function createNews(img, title, content, timestamp, tags, video) {
        var html_tags = '';
		var html_video = '';
        if (tags != null) {
            $.each(tags, function(index, val) {
                if (val.name == 'Communications')
                    html_tags += '\<span class="spanTag" style="background-color: rgb(77, 134, 176);">COMM</span>  ';
                if (val.name == 'Corporate Sustainability')
                    html_tags += '\<span class="spanTag" style="background-color: rgb(137, 217, 78);">CS</span>  ';
                if (val.name == 'Finance')
                    html_tags += '\<span class="spanTag" style="background-color: rgb(219, 218, 0);">FIN</span>  ';
                if (val.name == 'Trade Union')
                    html_tags += '\<span class="spanTag" style="background-color: rgb(147, 182, 164);">GTU</span>  ';
                if (val.name == 'Human Resources')
                    html_tags += '\<span class="spanTag" style="background-color: rgb(230, 170, 0);">HR</span>  ';
                if (val.name == 'Innovation')
                    html_tags += '\<span class="spanTag" style="background-color: rgb(76, 176, 170);">INNO</span>  ';
                if (val.name == 'Center Operations')
                    html_tags += '\<span class="spanTag" style="background-color: rgb(138, 116, 122);">OPS</span>  ';
                if (val.name == 'Technical Development')
                    html_tags += '\<span class="spanTag" style="background-color: rgb(121, 110, 172);">TD</span>  ';
            });
        }

        if (html_tags.length == 0) {
            html_tags = '\<span style="height: 35px;"> &nbsp; </span>';
        }
		
		if (video) {
			if(video.match(/.mp4|.ogg|.webm|.MP4|.OGG|.WEBM/)){
				html_video = '\<div style="margin:10px;">\
				<video width="100%" id="videoFrame" preload="auto" controls webkit-playsinline onplaying="javascript:$("#newsroom_detailed_listview label").click();">\
				<source src="'+video+'" type="video/'+video.substr(video.lastIndexOf(".")+1)+'"/>\
				</video>\
				</div>';
			}else{
				html_video = '\<div style="margin:10px;">\
				<iframe src="'+video+'" width="100%" id="videoFrame" frameborder=0 allowfullscreen onload="javascript:$(this).height($(this).height()*1.25);"></iframe>\
				</div>';
			}           
        }

        // Nick removed for multiple images start
        // var html = '\<li style="border: 0px;padding: 0px;background-color:white;overflow: auto">\
        //     <div style="width: 100%" >\
        //         <img src="'+img+'"\ style="width: 100%;" alt=""/>\
        //         <div style="background: rgba(0,0,0,.5);margin-top: -24px;color: #FFFFFF;text-align: right;padding-right: 7px;position: relative;">Tap for more photos</div>\
        //     </div>\
        //     <label style="margin: 10px; font-size: 18px; white-space:normal;color: #404040">'+title+'\</label>\
        //     <div style="margin: 10px 10px 0px 10px; opacity:0.5; font-size: 10px;color: #404040;white-space:normal;">\
        //     '+timestamp+'\
        //     \</div>\
        //     <div style="margin: 10px">\
        //         <div style="white-space:normal;font-weight: normal;font-size: 12px;color: #404040">'+content.replace(/\n/g,'</br>')+'\</div>\
        //     </div>\
        //     <div style="border-bottom: solid 1px;border-bottom-color: #C0C0C0;width: 100%"></div>\
        //     <div style="margin-left: 10px;width: auto;white-space: normal;">\
        //         '+html_tags+'\
        //     \</div>\
        //     <div style="clear:left; width: 100%;height:10px;"></div>\
        // </li>';
        // Nick removed for multiple images end
        // Nick added for multiple images start
        var morePhotosLabel = m_news.imageList.length > 0 ? '\<div style="background: rgba(0,0,0,.5);margin-top: -24px;color: #FFFFFF;text-align: right;text-shadow: none;padding-right: 7px;position: relative;font-size: 15px;height: 20px;line-height: 20px;">Tap for more photos\</div>' : '',
            html = '\<li style="border: 0px;padding: 0px;background-color:white;overflow: auto">\
            <div style="width: 100%" >\
                <img src="'+img+'" style="width: 100%;" alt=""/>'
                + morePhotosLabel + '\
            </div>\
            <label style="margin: 10px; font-size: 18px; white-space:normal;color: #404040">'+title+'\</label>\
            <div style="margin: 10px 10px 0px 10px; opacity:0.5; font-size: 10px;color: #404040;white-space:normal;">\
            '+timestamp+'\
            </div>\
            <div style="margin: 10px">\
                <div style="white-space:normal;font-weight: normal;font-size: 12px;color: #404040">'+content.replace(/\n/g,'</br>')+'\</div>\
            </div>\
			'+html_video+'\
            <div style="border-bottom: solid 1px;border-bottom-color: #C0C0C0;width: 100%"></div>\
            <div style="margin-left: 10px;width: auto;white-space: normal;">\
                '+html_tags+'\
            </div>\
            <div style="clear:left; width: 100%;height:10px;"></div>\
        </li>';
        // Nick added for multiple images end

        return html;
    }

    // 展示的时候请求新闻
    $("#newsroom_detailed").on( "pageshow", function( event ) {
//        getNews();
		$("#newsroom_detailed_listview img").off('click').on('click', function(){
		// Nick added for multiple images start
		if (m_news.imageList.length > 0)
		// Nick added for multiple images end
			$.mobile.newChangePage('#page_multipulte_img',{ transition: "slide",reverse: false,changeHash: false})
		});
    });
	
	/*multipulte_img start*/
	$("#page_multipulte_img").off('pageshow').on('pageshow', function(e){
		// Nick removed for multiple images start
		// var imglist = ["http://www.3visual3.com/uploads/allimg/140115/1-1401150Z034.jpg","http://www.3visual3.com/uploads/allimg/140115/1-1401150Z038.jpg","http://www.3visual3.com/uploads/allimg/140115/1-1401150Z043.jpg"];
		// Nick removed for multiple images end
		// Nick added for multiple images start
		imglist = window.imageList;
		// Nick added for multiple images end
		  
		  var template = "";
		  for(var i in imglist){
			// Nick removed for multiple images start
			// template += "<div class='pic'> <img src='"+imglist[i]+"' /> </div>";
			// Nick removed for multiple images end
			// Nick added for multiple images start
			template += "<div class='pic'> <img src='"+imglist[i].imagePath+"' /> </div>";
			// Nick added for multiple images end
		  }

		  // Nick added for multiple images start
		  var startX;
		  // Nick added for multiple images end
		  var lastX;
		  var picWidth = $(document).innerWidth();
		  var _picn = imglist.length;
		  var picTotalWidth = picWidth*_picn;
		  
		  $(".pic-show").css("width",picTotalWidth).html(template);
		  var pics= $(".pic");
		  pics.css('width',picWidth);
		    // Nick added for multiple images start
		    $(".pic-show").find("img").one("load", function() {
		        var $this = $(this),
		            imgHeight = $this.height();
		        $this.css("margin-top", -imgHeight / 2);
		    });
		    // Nick added for multiple images end
		  $(".pic-num").html("1/"+_picn);
		  
		  $(".vertical-middle").off('touchmove').on("touchmove",function(e){
			e.preventDefault();
			var currentX = e.originalEvent.touches[0].clientX;
			var dltaX = currentX - lastX;
			 if(currentX > lastX){
				 var left = parseInt($(".pic-show").css('left'));
				 $(".pic-show").css("left",left+dltaX);
			 }else{
				 var left = parseInt($(".pic-show").css('left'));
				 $(".pic-show").css("left",left+dltaX);
			 }
			 lastX = currentX
		  });
		  $(".vertical-middle").off('touchstart').on("touchstart",function(e){
			 lastX = e.originalEvent.touches[0].clientX;
			 // Nick added for multiple images start
			 startX = lastX;
			 // Nick added for multiple images end
		  });
		  $(".vertical-middle").off('touchend').on("touchend",function(e){
			var left = parseInt($(".pic-show").css('left'));
			if(left>0){
				show(0);
			// Nick removed for multiple images start
			// }else if(Math.abs(left) > (picTotalWidth-(picWidth/2))){
			// Nick removed for multiple images end
			// Nick added for multiple images start
			}else if(Math.abs(left) > (picTotalWidth-picWidth)){
			// Nick added for multiple images end
				show(_picn-1);
			}else {
				// Nick removed for multiple images start
				// show(Math.abs(Math.round(left/picWidth)));
				// Nick removed for multiple images end
				// Nick added for multiple images start
				var currentX = e.originalEvent.changedTouches[0].clientX;
				if (currentX - startX > 0) {
					show(Math.abs(Math.ceil(left / picWidth)));
				} else {
					show(Math.abs(Math.floor(left / picWidth)));
				}
				// Nick added for multiple images end
			}
		  });
		  function show(index){
			var $_picL = -index*picWidth;
			var picH = $(pics[index]).height();
			$(".pic-show").animate({"left":$_picL},200);
			$(".pic-num").html(1+index+"/"+_picn);
		  }
		  
		  
	});
	
	$("#page_multipulte_img").on('pagehide', function(){
		 $(".pic-show").empty();
		 $(".pic-show").css('left',0);
	});
	
	$(".btn_back").off('click').on('click', function(){
		$.mobile.goBackPage();
	});
	/*multipulte_img end*/

    // 消失的时候删除新闻
    /*$("#newsroom_detailed").on( "pagehide", function( event ) {
        $('#newsroom_detailed_listview').empty();
    });*/

    //
    $(document).ready(function() {
        $('#Newsroom_detailed_btn_menu').on('click',function() {
            $.mobile.newChangePage("#newsroom",{ transition: "slide",reverse: true,changeHash: false});
        });

        // 兼容其他浏览器
        compatibility();
    });

    //设置内容高度是Header剩下的高度
    $("#newsroom_detailed").on( "pageshow", function( event ) {
        window.setBodyOverflow($(document.body));
        $('#newsDetail_content').css('height',($(window).height()-40));
    });

    function compatibility() {
        /* Logon */
        $('#title_newsroom_details').parent()
            .css('display', 'block')
            .css('postion', 'relative');

        $('#title_newsroom_details').css('postion', 'absulute')
            .css('width', '87px')
            .css('height','20px')
            .css('margin', '8px auto auto auto');
    }

    return {
        showDetailWithNews : function (news) {
            // Nick added for multiple images start
            m_news = news;
            window.imageList = news.imageList;
            // Nick added for multiple images end
            getNews(news);
        }
    }

});